<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <script src="/back/js/jquery-3.4.1.min.js"></script>
    <link rel="stylesheet" href="/back/css/login.css">
    <script src="js/myAjax.js"></script>
</head>
<body>
<div class="login">
    <div>
        <div class="content">
            <div class="text">用户名:</div>
            <div class="input"><input type="text" id="username" placeholder="请输入用户名" value="admin" onkeypress="loginin()"/></div>
        </div>
        <div class="content">
            <div class="text">密 码:</div>
            <div class="input"><input type="password" id="password" placeholder="请输入密码" value="123" onkeypress="loginin()"/></div>
        </div>
        <div class="content">
            <div class="text">验证码:</div>
            <div class="code"><input type="text" id="code" placeholder="请输入验证码" onkeypress="loginin()"/></div>
            <span><img src="http://localhost:8055/getCode" id="imgcode" onclick="flushCode()"/></span>
        </div>
        <div><span id="te"></span></div>
        <div class="content">
            <div class="button"><input id="login" type="button" value="登录" onclick="login()"/></div>
            <div class="button"><input type="button" value="注册" onclick="window.location.href='/regester.html'"></div>
        </div>
    </div>
</div>
</body>
<script>
    //登录====================================================
    function loginin() {
        if (event.keyCode == 13) {
            $("#login").click();
        }
    }

    function login() {
        let data1 = {
            username: $("#username").val(),
            code: $("#code").val(),
            password: $("#password").val()
        };
        let data = myAjax("/login", data1, "post");
        if (data.result == -1) {
            $("#te").html("你输入的账户不存在");
            $("#te").css("color", "red");
        } else if (data.result == 2) {
            $("#te").html("你输入的密码错误");
            $("#te").css("color", "red");
        } else if (data.result == 1) {
            window.location.href = '/back/html/main.html';
        } else if (data.result == 3) {
            $("#te").html("验证码错误");
            $("#te").css("color", "red");
            flushCode();
        }
    };

    //刷新 验证码~~~~=======================================================
    function flushCode() {
        document.getElementById("imgcode").src = "http://localhost:8055/getCode?date=" + new Date();
        // $("#imgcode").attr(src,"/getCode?date="+new Date());
    };


</script>
</html>